<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../../webapp/css/all.css">
    <link rel="stylesheet" href="../../webapp/css/pages-cart.css">
    <script src="../../webapp/js/vue.js"></script>
    <script src="../../webapp/js/axios.js"></script>

</head>
<body>
<div id="app">
    <el-table :data="tableData" border style="width: 100%">
        <el-table-column prop="id" label="ID"></el-table-column>
        <el-table-column prop="nam" label="姓名"></el-table-column>
        <el-table-column label="性别">
            <template slot-scope="scope">
                <span>{{ scope.row.sex == '1' ? '男' : '女'}}</span>
            </template>
        </el-table-column>
        <el-table-column prop="pwd" label="密码"></el-table-column>
        <el-table-column prop="birth" label="日期"></el-table-column>
        <el-table-column label="操作">
            <template slot-scope="scope">
                <el-button @click="content(scope.row.id)" size="mini" type="primary" size="small">详情</el-button>
                <el-button @click="edit(scope.row.id)" size="mini" type="primary" size="small">修改</el-button>
                <el-button @click="dele(scope.row.id)" size="mini" type="danger" size="small">删除</el-button>
            </template>
        </el-table-column>
    </el-table>


</div>
<script>
    let app = new Vue({
        el: "#app",
        data: {
            tableData: [],

        },
        methods: {
            UserList() {
                axios.get("list").then(res => {
                    this.tableData = res.data;
                })
            }
        },
        created() {
            this.UserList();
        }
    })
</script>
</body>
</html>